<template>
  <div>
    <!-- <headertitle></headertitle> -->
    <div class="body" id="body2">
      <div class="P_Box">
        <h2>订单已提交，请再24小时内完成支付</h2>
        <p class="P_top">
          <span>
            应付金额:
            <strong>165.9</strong>(在线支付)
          </span>
          <span>订单编号:425954156947</span>
        </p>
        <p>支付平台</p>
        <div class="P_main clear">
          <span>微信支付</span>
          <span>银联支付</span>
          <span>余额支付(￥500)</span>
        </div>
        <div class="P_pay">
          <div class="P_payLeft1 P_payLeft">
            <p>使用电脑支付</p>
            <img src="../../public/images/erwei.png" alt />
            <div class="now">立即支付</div>
          </div>
          <div class="huo">或</div>
          <div class="P_payRight">
            <p>使用支付宝扫一扫付款</p>
            <img src="../../public/images/erwei.png" alt />
          </div>
        </div>
      </div>
    </div>
    <!-- <footertitle></footertitle> -->
  </div>
</template>

<script>
// import headertitle from "../components/headertitle.vue";
// import footertitle from "../components/footertitle.vue";
// export default {
//   components: { headertitle, footertitle }
// };
</script>
<style>
#body2 .P_Box {
  width: 70%;
  margin-left: 15%;
}
#body2 .P_Box h2 {
  width: 100%;
  font: 30px/200px "simhei";
  color: coral;
  text-align: center;
}
#body2 .P_top strong {
  color: red;
}
#body2 .P_top span:last-of-type {
  float: right;
}
#body2 .P_Box p:nth-of-type(2) {
  padding: 20px 0;
  border-bottom: 1px solid #000;
  margin-bottom: 20px;
}
#body2 .P_main {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
#body2 .p_pay {
  width: 100%;
}
/* #body2 .P_payTop img{
  width:100%;
} */
</style>
